<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小兵优化测试</title>
    <style>
        body {
            margin: 0;
            padding: 20px;
            background: #000;
            color: #fff;
            font-family: Arial, sans-serif;
        }
        canvas {
            border: 1px solid #333;
            background: #111;
        }
        .info {
            margin-top: 10px;
            padding: 10px;
            background: #222;
            border-radius: 5px;
        }
        .controls {
            margin-top: 10px;
            padding: 10px;
            background: #333;
            border-radius: 5px;
        }
        button {
            margin: 5px;
            padding: 8px 16px;
            background: #4a90e2;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }
        button:hover {
            background: #357abd;
        }
        .stats {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
            margin-top: 10px;
        }
        .stat-box {
            background: #444;
            padding: 10px;
            border-radius: 5px;
        }
    </style>
</head>
<body>
    <h1>小兵优化测试</h1>
    <canvas id="testCanvas" width="800" height="600"></canvas>
    <div class="info">
        <p>测试小兵系统优化功能</p>
        <p>• 小兵自动攻击敌人</p>
        <p>• 小兵自动跟随玩家</p>
        <p>• 小兵升级速度加快</p>
        <p>• 观察控制台输出调试信息</p>
    </div>
    <div class="controls">
        <button onclick="addMinion()">添加小兵</button>
        <button onclick="addEnemy()">添加敌人</button>
        <button onclick="toggleDebug()">切换调试模式</button>
        <button onclick="resetTest()">重置测试</button>
    </div>
    <div class="stats">
        <div class="stat-box">
            <h3>小兵统计</h3>
            <p id="minionStats">小兵数量: 0</p>
            <p id="minionLevel">平均等级: 0</p>
            <p id="minionDamage">总伤害: 0</p>
        </div>
        <div class="stat-box">
            <h3>敌人统计</h3>
            <p id="enemyStats">敌人数量: 0</p>
            <p id="enemyKilled">已击杀: 0</p>
            <p id="testTime">测试时间: 0s</p>
        </div>
    </div>

    <script src="js/utils.js"></script>
    <script src="js/minion.js"></script>
    <script src="js/enemy.js"></script>
    <script>
        // 全局变量
        let minionManager;
        let enemies = [];
        let player = { x: 400, y: 300 };
        let debugMode = true;
        let testStartTime = Date.now();
        let totalDamage = 0;
        let enemiesKilled = 0;
        
        // 初始化测试
        function initTest() {
            const canvas = document.getElementById('testCanvas');
            const ctx = canvas.getContext('2d');
            
            // 创建小兵管理器
            minionManager = new MinionManager();
            
            // 添加一些初始小兵
            minionManager.addMinion(200, 200);
            minionManager.addMinion(600, 200);
            minionManager.addMinion(400, 400);
            
            // 添加一些初始敌人
            addEnemy();
            addEnemy();
            addEnemy();
            
            // 渲染循环
            function render() {
                ctx.clearRect(0, 0, canvas.width, canvas.height);
                
                // 绘制网格
                ctx.strokeStyle = '#333';
                ctx.lineWidth = 1;
                for (let i = 0; i < canvas.width; i += 50) {
                    ctx.beginPath();
                    ctx.moveTo(i, 0);
                    ctx.lineTo(i, canvas.height);
                    ctx.stroke();
                }
                for (let i = 0; i < canvas.height; i += 50) {
                    ctx.beginPath();
                    ctx.moveTo(0, i);
                    ctx.lineTo(canvas.width, i);
                    ctx.stroke();
                }
                
                // 绘制玩家
                ctx.fillStyle = '#00FF00';
                ctx.beginPath();
                ctx.arc(player.x, player.y, 15, 0, Math.PI * 2);
                ctx.fill();
                ctx.strokeStyle = '#FFFFFF';
                ctx.lineWidth = 2;
                ctx.stroke();
                
                // 更新和渲染小兵
                minionManager.update(16, enemies);
                minionManager.render(ctx);
                
                // 更新和渲染敌人
                updateEnemies();
                renderEnemies(ctx);
                
                // 更新统计信息
                updateStats();
                
                // 绘制调试信息
                if (debugMode) {
                    ctx.fillStyle = '#fff';
                    ctx.font = '12px Arial';
                    ctx.fillText(`小兵数量: ${minionManager.getMinionCount()}`, 10, 20);
                    ctx.fillText(`敌人数量: ${enemies.length}`, 10, 35);
                    ctx.fillText(`平均等级: ${minionManager.getAverageLevel()}`, 10, 50);
                    ctx.fillText(`总伤害: ${totalDamage}`, 10, 65);
                    ctx.fillText(`已击杀: ${enemiesKilled}`, 10, 80);
                }
                
                requestAnimationFrame(render);
            }
            
            render();
        }
        
        // 添加小兵
        function addMinion() {
            const x = Math.random() * 700 + 50;
            const y = Math.random() * 500 + 50;
            minionManager.addMinion(x, y);
            console.log(`添加了小兵在位置 (${x}, ${y})`);
        }
        
        // 添加敌人
        function addEnemy() {
            const x = Math.random() * 700 + 50;
            const y = Math.random() * 500 + 50;
            const enemy = new Enemy(x, y, 'basic');
            enemies.push(enemy);
            console.log(`添加了敌人在位置 (${x}, ${y})`);
        }
        
        // 更新敌人
        function updateEnemies() {
            enemies.forEach(enemy => {
                if (!enemy.isDead) {
                    // 简单移动
                    enemy.x += (Math.random() - 0.5) * 2;
                    enemy.y += (Math.random() - 0.5) * 2;
                    
                    // 边界检查
                    enemy.x = Math.max(20, Math.min(780, enemy.x));
                    enemy.y = Math.max(20, Math.min(580, enemy.y));
                }
            });
            
            // 清理死亡的敌人
            enemies = enemies.filter(enemy => !enemy.isDead);
        }
        
        // 渲染敌人
        function renderEnemies(ctx) {
            enemies.forEach(enemy => {
                if (!enemy.isDead) {
                    ctx.fillStyle = '#FF0000';
                    ctx.beginPath();
                    ctx.arc(enemy.x, enemy.y, 12, 0, Math.PI * 2);
                    ctx.fill();
                    
                    ctx.strokeStyle = '#FFFFFF';
                    ctx.lineWidth = 1;
                    ctx.stroke();
                }
            });
        }
        
        // 更新统计信息
        function updateStats() {
            const testTime = Math.floor((Date.now() - testStartTime) / 1000);
            
            document.getElementById('minionStats').textContent = `小兵数量: ${minionManager.getMinionCount()}`;
            document.getElementById('minionLevel').textContent = `平均等级: ${minionManager.getAverageLevel()}`;
            document.getElementById('minionDamage').textContent = `总伤害: ${totalDamage}`;
            document.getElementById('enemyStats').textContent = `敌人数量: ${enemies.length}`;
            document.getElementById('enemyKilled').textContent = `已击杀: ${enemiesKilled}`;
            document.getElementById('testTime').textContent = `测试时间: ${testTime}s`;
        }
        
        // 切换调试模式
        function toggleDebug() {
            debugMode = !debugMode;
            console.log(`调试模式: ${debugMode ? '开启' : '关闭'}`);
        }
        
        // 重置测试
        function resetTest() {
            minionManager.reset();
            enemies = [];
            totalDamage = 0;
            enemiesKilled = 0;
            testStartTime = Date.now();
            
            // 重新添加初始小兵和敌人
            minionManager.addMinion(200, 200);
            minionManager.addMinion(600, 200);
            minionManager.addMinion(400, 400);
            addEnemy();
            addEnemy();
            addEnemy();
            
            console.log('重置了测试环境');
        }
        
        // 监听鼠标移动来移动玩家
        document.getElementById('testCanvas').addEventListener('mousemove', (e) => {
            const rect = e.target.getBoundingClientRect();
            player.x = e.clientX - rect.left;
            player.y = e.clientY - rect.top;
        });
        
        // 启动测试
        initTest();
    </script>
</body>
</html> 